Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove crossOrigin attribute changing #598

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

quangbuule
Copy link

Hi,

Changing crossOrigin attribute here will prevent loading image from trusted source (having capability of reading credentials from current domain).

For example: I am at website https://example.com. I want to crop the image that is located at https://img.example.com/some.jpg - which have ability of reading cookie from *.example.com to authenticate me. But the code of Croppie set the crossOrigin to anonymous (for any http/https images), so it fails loading the image.

I suggest letting it be default behavior of browser.

Cheers!

@thedustinsmith
Copy link
Contributor

That code is there so we can load images from a different domain. I'd be OK with adding an option to indicate whether or not we should include that attribute, but I don't think removing it completely will work for cross domain requests ... will it?

@quangbuule
Copy link
Author

Let 's take a look at the images I uploaded here, it's located at another domain, and loaded safe and sound without setting any crossorigin.

Also, the crossorigin will fallback to anonymous, so the code to set the crossorigin is not needed.
Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img (Section crossorigin)

Thank you!

@thedustinsmith
Copy link
Contributor

If the attribute is not present, the resource is fetched without a CORS request (i.e., without sending the Origin HTTP header), preventing its non-tainted usage in elements. If invalid, it is handled as if the anonymous value was used. See CORS settings attributes for additional information.

If the attribute is not present, the Origin header will not be sent.

Your image loads fine, I'm not disagreeing with that. It's when you draw that image to a canvas, and try to get get data from that canvas is when you run into problems.

@quangbuule
Copy link
Author

You are right, we should add that as an option. In my case I just need the metadata (positioning, scale...), not the canvas data. So I didn't notice the issue when removing the crossOrigin.

@ryios
Copy link

ryios commented Jan 25, 2021

Yeah anonymous doesn't work for authenticated images. The image I am trying to crop is on a custom rendering end point and it's not anonymous, it requires authentication so I need "withCredentials" to be set, the code in cropper.js physically removes my withCredentials configuration and causes it to not render in croppie.

Simply removing that code so that my withCredentials attribute is respected resolves the problem. I don't think croppie should be removing the attribute or setting it to anonymous, just respect whatever the user sets on their img tag. Optionally only do that if it doesn't already have a crossOrigin attribute.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants